<div class="tutorial-bundle" data-metadata-json='{"difficulty": "getting started"}' data-tip-sha1="2df6f528a770a96e3f34fd271cd30a6657af2ce3"><div class="front-matter" data-complete-code-text='import pytch

class Snake(pytch.Sprite):
    Costumes = ["Snake.png"]

    @pytch.when_this_sprite_clicked
    def speak(self):
        self.say_for_seconds("Hello there!", 2.0)
' data-initial-code-text=""><h1>Hello there!</h1><p>In this tutorial we will learn about how to create and run a Pytch project with a Sprite.</p></div><div class="chapter-content"><h2>Writing a Pytch program</h2><p>Pytch programs are written in a programming language called Python, to
which we have added extra commands for Sprites, sounds, and other
things. You make a Pytch project by writing a Python program using the
special Pytch system.</p><p>The first line tells Python that we will be using the Pytch
add-ons. If you leave this out then you can only write ordinary Python
programs without Sprites, so the Pytch web site puts that line in for
you when you make a new project.</p><p>When you see a block of code like this, with some lines of text shown
in green with "+" symbols in front of them, it's telling you to change
your project so that it has the new lines in green added to it. Add
them in exactly the places where they are shown.</p><div class="patch-container" data-code-as-of-commit="import pytch
" data-slug="import-specifics"><div class="patch"><table><tbody class="diff-add" data-added-text="import pytch
"><tr><td class="linenum"></td><td class="linenum"><pre>1</pre></td><td><pre>import pytch</pre></td></tr></tbody></table></div></div></div><div class="chapter-content"><h2>Creating the Sprite</h2><p>We'll start with the sprite that the player will control.</p><p>To create a new sprite we need to say three things: that we are
creating a new "thing" in the project, give the thing a name, and say
that it is a Sprite (rather than a Background or some other sort of
thing). In Pytch we can do that by making a new "class" and giving it
a name.</p><p>For this example I've chosen the name "Snake" but really you could
name it nearly anything you like.</p><p>Notice that the line ends with a ":" marker. There is more to come in
the definition of Snake, and this symbol is how we tell Pytch that
there will be more to the Snake class.</p><div class="patch-container" data-code-as-of-commit="import pytch

class Snake(pytch.Sprite):
" data-slug="create-snake-class"><div class="patch"><table><tbody class="diff-unch"><tr><td class="linenum"><pre>1</pre></td><td class="linenum"><pre>1</pre></td><td><pre>import pytch</pre></td></tr></tbody><tbody class="diff-add" data-added-text="
class Snake(pytch.Sprite):
"><tr><td class="linenum"></td><td class="linenum"><pre>2</pre></td><td><pre></pre></td></tr><tr><td class="linenum"></td><td class="linenum"><pre>3</pre></td><td><pre>class Snake(pytch.Sprite):</pre></td></tr></tbody></table></div></div></div><div class="chapter-content"><h2>Adding a costume</h2><p>Once we have created the new Sprite the next job is to say what it
looks like and how it behaves. In this tutorial we have already added
a picture for the snake costume to the project, so let's connect it to
the sprite.</p><p>We need to write a line that sets up a <em>variable</em> in the new Sprite
that will hold a list of the costumes.</p><p>Pytch needs to find the list in a variable named <code>Costumes</code> (with a
capital <code>C</code>). If we call it anything else then Pytch won't be looking
in the right place when it goes to find the costumes.</p><p>This variable contains a list of the images in the project that will
be used by this Sprite as costumes. In Python we create lists by
writing things between square brackets (<code>[</code> and <code>]</code> characters). When we
mention the file name we need to put it between double-quote
characters (these: <code>"</code>).</p><p>Finally, so that the instruction is contained <em>within</em> the Sprite —
that is, it's pushed in from the left of the program a bit. This is
how Python knows that this variable is part of the Sprite. Everything
that's part of the Sprite has to be "indented" (pushed in) the same
amount.</p><p>So, to create our <code>Costumes</code> variable we need a line like this.</p><div class="patch-container" data-code-as-of-commit='import pytch

class Snake(pytch.Sprite):
    Costumes = ["Snake.png"]
' data-slug="snake-costume"><div class="patch"><table><tbody class="diff-unch"><tr><td class="linenum"><pre>1</pre></td><td class="linenum"><pre>1</pre></td><td><pre>import pytch</pre></td></tr><tr><td class="linenum"><pre>2</pre></td><td class="linenum"><pre>2</pre></td><td><pre></pre></td></tr><tr><td class="linenum"><pre>3</pre></td><td class="linenum"><pre>3</pre></td><td><pre>class Snake(pytch.Sprite):</pre></td></tr></tbody><tbody class="diff-add" data-added-text='    Costumes = ["Snake.png"]
'><tr><td class="linenum"></td><td class="linenum"><pre>4</pre></td><td><pre>    Costumes = ["Snake.png"]</pre></td></tr></tbody></table></div></div><p>If you click the green flag now, you should see the Snake appear in
the middle of the stage.  Try it!</p></div><div class="chapter-content"><h2>Adding a script</h2><p>These lines add a new script (Python programmers sometimes calls these
"functions" or "methods" instead of scripts) to the Sprite. The word
"def" followed by the name of the function creates it, and the lines
that are indented more than the first line are the instructions that
are contained within the script.</p><div class="patch-container" data-code-as-of-commit='import pytch

class Snake(pytch.Sprite):
    Costumes = ["Snake.png"]

    def speak(self):
        self.say_for_seconds("Hello there!", 2.0)
' data-slug="snake-speak-1"><div class="patch"><table><tbody class="diff-unch"><tr><td class="linenum"><pre>2</pre></td><td class="linenum"><pre>2</pre></td><td><pre></pre></td></tr><tr><td class="linenum"><pre>3</pre></td><td class="linenum"><pre>3</pre></td><td><pre>class Snake(pytch.Sprite):</pre></td></tr><tr><td class="linenum"><pre>4</pre></td><td class="linenum"><pre>4</pre></td><td><pre>    Costumes = ["Snake.png"]</pre></td></tr></tbody><tbody class="diff-add" data-added-text='
    def speak(self):
        self.say_for_seconds("Hello there!", 2.0)
'><tr><td class="linenum"></td><td class="linenum"><pre>5</pre></td><td><pre></pre></td></tr><tr><td class="linenum"></td><td class="linenum"><pre>6</pre></td><td><pre>    def speak(self):</pre></td></tr><tr><td class="linenum"></td><td class="linenum"><pre>7</pre></td><td><pre>        self.say_for_seconds("Hello there!", 2.0)</pre></td></tr></tbody></table></div></div><p>Now, we haven't yet told Pytch when it should run this script. We need
to attach a "hat" block to it, something that tells Pytch to run the
script at the right time. We can set this script to run when the Snake
sprite is clicked on.</p><div class="patch-container" data-code-as-of-commit='import pytch

class Snake(pytch.Sprite):
    Costumes = ["Snake.png"]

    @pytch.when_this_sprite_clicked
    def speak(self):
        self.say_for_seconds("Hello there!", 2.0)
' data-slug="when-clicked"><div class="patch"><table><tbody class="diff-unch"><tr><td class="linenum"><pre>3</pre></td><td class="linenum"><pre>3</pre></td><td><pre>class Snake(pytch.Sprite):</pre></td></tr><tr><td class="linenum"><pre>4</pre></td><td class="linenum"><pre>4</pre></td><td><pre>    Costumes = ["Snake.png"]</pre></td></tr><tr><td class="linenum"><pre>5</pre></td><td class="linenum"><pre>5</pre></td><td><pre></pre></td></tr></tbody><tbody class="diff-add" data-added-text="    @pytch.when_this_sprite_clicked
"><tr><td class="linenum"></td><td class="linenum"><pre>6</pre></td><td><pre>    @pytch.when_this_sprite_clicked</pre></td></tr></tbody><tbody class="diff-unch"><tr><td class="linenum"><pre>6</pre></td><td class="linenum"><pre>7</pre></td><td><pre>    def speak(self):</pre></td></tr><tr><td class="linenum"><pre>7</pre></td><td class="linenum"><pre>8</pre></td><td><pre>        self.say_for_seconds("Hello there!", 2.0)</pre></td></tr></tbody></table></div></div></div><div class="chapter-content"><h2>Running the Project</h2><p>Finally, we can press the <em>green flag</em> and see the results of this
work! When you click the green flag, the Snake should appear on the
stage, and when you click on it, a speech balloon will appear.</p><p>Congratulations on your first Pytch project!</p></div><div class="chapter-content"><h2>Challenges</h2><p>Can you change your program to complete these challenges?</p><ul>
<li>
<p>Make the Snake say <code>"Hi there!"</code> instead of <code>"Hello there!"</code>.</p>
</li>
<li>
<p>Make the Snake's speech balloon appear for 3 seconds instead of
  2 seconds.</p>
</li>
<li>
<p>(More advanced:) Make the Snake say two things, one after the other.
  Maybe it could say <code>"Hi there!"</code> for two seconds, and then <code>"OK,
  bye!"</code> for two seconds.</p>
</li>
</ul></div><div class="chapter-content"><h2>Credits</h2><div class="asset-credits"><p class="credit-intro">For <code class="asset-filename">Snake.png</code> (used in the project):</p><div class="credits"><p>The snake image is taken from <a href="https://www.clker.com/clipart-snake-10.html"><em>Snake Clip
Art</em></a>, which declares it
to be in the public domain.  We have resized it.</p></div><p class="credit-intro">For <code class="asset-filename">screenshot.png</code> (used in the tutorial text/summary):</p><div class="credits"><p>Created by the Pytch team.</p></div></div></div></div>